const Vue = require('vue')
const renderer = require('vue-server-renderer').createRenderer()
const express = require('express')

const server = express()
server.get('/', (req, res) => {
    const app = new Vue({
        template: `
            <div id="app">
                <h1>{{message}}</h1>
            </div>
        `,
        data() {
            return {
                message: '小明'
            }
        }
    })
    renderer.renderToString(app, (err, html) => {
        if (err) res.status(500).end('Internal Server Error.')
        // 设置编码
        res.setHeader('Content-Type','text/html; charset=utf8')
        res.end(`
        <!DOCTYPE html>
        <html lang="en">
            <head>
                <meta charset="utf-8">
                <meta name="viewport" content="width=device-width,initial-scale=1.0">
                <title>Hello</title>
            </head>
            <body>
                ${html}
            </body>
        </html>
        `)
    })
})
server.listen(3000,()=>{
    console.log(`server running at 3000`)
})
